class FirstPage extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            list: [],
            thumburl: '',
            name: '',
            id: '0',
            fanghao:'',
            showchose: !1,
            partcount: 1,
            parts: [{ src: '' }, { src: '' }, { src: '' }],
            categorylist: [],
            select_swiperlink: { name: '请选择' },
            swiperimglist: [],
            category_select_list: [],
            recommendtablehtml: [],
            recommendlist: [],
            goods_select_html: [],
            currentswipertype: 0,
            swiperlinkhtml: [],
            swipertablehtml: [],
            swiperimghtml: [],
            choselist:[],
            additem:{
                name:'',
                pwd:''
            },
            subtitle: '',
            totalamount: 0,
            exportlist: [],
            
            swiper: {
                imgs: [],
                links: []
            },
            fileimgshow: !0,
            imgstate: '',
            imgsrc: '',
            to: '',
        };
    }




    componentDidMount() {
        $('.modal1').hide()

        this.freshlist()

    }
    freshlist() {
        account_getlist(res => {
            if (res.issuccess == 1) {
              
            }
        })


    }





    /**新建 */
    add() {
        // $('.modal1').show()
        var name = prompt('请输入房间名称')
        if (name != '') {
            aoedzroom({ name }, res => {
                if (res.issuccess == 1) {
                    this.freshlist()
                } else {
                    alert(res.msg)
                }
            })
        }
    }


    // 编辑
    edit(x) {
        var name = prompt('请编辑房间名称', x.name)
        console.log(name, 'namename');
        if (name != '' && name != null && name != x.name) {
            //  console.log(name,'name');

            aoedzroom({ id: x.id, name }, res => {
                if (res.issuccess == 1) {
                    //   alert('修改成功')
                    this.freshlist()
                } else {
                    alert(res.msg)
                }
            })
        }

        // 
    }
    tosub(x) {
        window.location.href = "./dz_subcate.html?id=" + x.id + "&name=" + x.name;
    }
    // 排序




    // 删除
    del(e, cid) {
        this.setState({ delid: e, newcid: cid }, () => {
            $('#myModal').modal('toggle');
        })
    }

    confirmdel() {
        let { delid, start } = this.state
        dz_delroom(delid, res => {
            if (res.issuccess == 1) {
                //  alert('删除成功')
                $('#myModal').modal('toggle');
                this.freshlist(start)
            } else {
                $('#myModal').modal('toggle');
                alert(res.msg);
            }
        })
    }

    closemodal() {
        $('.modal1').hide()
    }

    inputchange(prop, e) {
        this.setState({ [prop]: e.target.value })
    }
    confirm() {
        let { name, subtitle } = this.state, err = '';
        if (name.length == 0) err = '请输入名称'
        dz_project_aoe({ name, subtitle }, res => {
            $('.modal1').hide()
            if (res.issuccess == 1) {
                //   alert('提交成功')
                this.freshlist()
            }
        })
    }

    toitem(id) {
        window.location.href = './dz_item.html?id=' + id
    }

    selectchange(e) {
        this.setState({ selectroomid: e.target.value })

    }


    export() {



        let { exportlist } = this.state;

        let str = ''
        //`${topname}\n${housename}\n产品类型,高,宽,深度,单价,数量,总价,单位,立面说明,门板材质/柜体材质\n`
        const jsonData = []
        let total = 0;
        let totalcount = 0;
        // <td className="tconter">{((Number(x.height)* Number(x.width))/1000000).toFixed(2)}</td>
        //                                    <td className="tconter">{(Number(x.singleprice)* (((Number(x.height)* Number(x.width))/1000000).toFixed(2))).toFixed(2)}</td>

        console.log(exportlist, 'exportlistexportlist');
        exportlist.forEach(x => {
            str += `\n房间名称,${x.room.name}\n产品类型,高,宽,深度,数量,单位,单价,总价,立面说明,门板材质/柜体材质\n`
            x.cp.forEach(y => {
                str += `${y.cname},${y.height},${y.width},${y.deep},${y.count},${y.unit},${y.singleprice},${(Number(y.count) * Number(y.singleprice)).toFixed(2)},${y.lmsm},${y.cname1}\n`
            })
            str += `,,,平方总计,${x.cptotalcount},,金额合计,${x.cptotal}\n\n`

            str += `五金类型,高,宽,深度,数量,单位,单价,总价,立面说明,五金材质\n`
            x.wj.forEach(y => {
                str += `${y.cname},-,-,-,${y.count},${y.unit},${y.singleprice},${(Number(y.count) * Number(y.singleprice)).toFixed(2)},${y.lmsm},${y.cname1}\n`
            })
            str += `,,,五金总计,${x.wjtotalcount},,金额合计,${x.wjtotal}\n`
            str += `总金额,${Number(x.cptotal) + Number(x.wjtotal)}\n`
            total = Number(total) + Number(x.cptotal) + Number(x.wjtotal)
        })
        str += '\n\n总价合计,' + total
        let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(str);
        //通过创建a标签实现
        let link = document.createElement("a");
        link.href = uri;
        //对下载的文件命名
        link.download = name + ".csv";
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);

    }


    addroom() {
        let { selectroomid, exportlist, totalamount } = this.state;
        if (Number(selectroomid) > 0) {
            dz_getprojectitemlist(selectroomid, res => {
                if (res.issuccess == 1) {
                    let { room, wj, cp } = res;
                    let wjtotal = 0, cptotal = 0, cptotalcount = 0, wjtotalcount = 0, amount = 0
                    wj.forEach(x => {
                        wjtotal = (Number(wjtotal) + (Number(x.singleprice) * Number(x.count))).toFixed(2)
                        wjtotalcount = (Number(wjtotalcount) + Number(x.count)).toFixed(2)
                    })
                    cp.forEach(x => {
                        cptotalcount = (Number(cptotalcount) + Number(x.count)).toFixed(2)
                        cptotal = (Number(cptotal) + (Number(x.singleprice) * Number(x.count))).toFixed(2)
                    })
                    amount = (Number(wjtotal) + (Number(cptotal))).toFixed(2)
                    totalamount = (Number(totalamount) + (Number(amount))).toFixed(2)
                    let item = { room, wjtotal, cptotal, cptotalcount, wjtotalcount, amount, wj, cp }
                    console.log(item, 'item');
                    exportlist.push(item)
                    console.log(exportlist, 'exportlist');
                    this.setState({ exportlist, totalamount })
                }
            })
        }
    }

    input(e){
        this.setState({fanghao:e.target.value})

    }

    clickitem(i){
        let{list,choselist} = this.state;
        choselist.push(list[i])
        this.setState({choselist})
    }

    choseitem(i){
        let{choselist} = this.state;
        choselist.splice(i,1)
        this.setState({choselist})
    }
    confirm1() {
        let{choselist,fanghao,selectid} = this.state,idarr=[];
        if(fanghao=='') {
            alert('请输入业主地址')
            return;
        }else{
            choselist.forEach(x=>{
                idarr.push(x.id)
            })
    
            dz_projectdetail_add({selectid,ids:idarr.toString(),name:fanghao},res=>{
                this.setState({showchose:!1})
                if(res.issuccess==1){
                  //  this.freshlist()
                  //console.log();
                  window.location.href='./dz_detail.html?id='+res.newid
                }else{
                    alert(res.msg)
                }
            })
        }
    }

    save(){

    }



    render() {
        var { list, name, showchose, subtitle, choselist, choselist,fanghao,additem } = this.state;
        return (
            <div className="breadLinebox">

                {showchose ? <div className="modal_chose">

                    <div onClick={() => { this.setState({ showchose: !1 }) }} className="mask"></div>
                    <div className="wrap">
                        <div className="name">
                            <p>地址</p>
                            <input type="text" placeholder="请输入业主地址" value={fanghao} onChange={this.input.bind(this)} />
                        </div>
                        <div className="title">选择房间</div>
                        <div className="w">
                            <div className="left">
                                { 
                                    list.map((x, i) => {
                                        return (
                                            <div onClick={this.clickitem.bind(this, i)} className={`item ${x.c ? 'c' : ''}`}>
                                                {x.name}
                                            </div>
                                        )
                                    })
                                }
                            </div>
                            <div className="left r">
                                {
                                    choselist.map((x, i) => {
                                        return (
                                            <div onClick={this.choseitem.bind(this, i)} className='item'>
                                                {x.name}
                                            </div>
                                        )
                                    })
                                }

                            </div>
                        </div>
                        <div className="btns">
                            <div onClick={this.confirm1.bind(this)} className="confirm">确定</div>
                            <div onClick={() => { this.setState({ showchose: !1 }) }} className="cancel">取消</div>
                        </div>
                    </div>++
                </div>

                    : null

                }



                <div className="modal1" >
                    <div onClick={this.closemodal.bind(this)} className="mask"></div>
                    <div className="wrap">
                        <div className="content">
                            <p className="p1">名称</p>
                            <input placeholder="请输入名称" allowClear value={name} onChange={this.inputchange.bind(this, 'name')} className="input" />
                            {/* <p className="p2">{zje}</p> */}
                        </div>
                        <div className="content">
                            <p className="p1">小标题</p>
                            <input placeholder="请输入小标题" allowClear value={subtitle} onChange={this.inputchange.bind(this, 'subtitle')} className="input" />
                        </div>
                        <div className="btns">
                            <p className="add" onClick={this.confirm.bind(this)}>确定</p>
                            <p className="add" onClick={this.closemodal.bind(this)}>取消</p>
                        </div>
                    </div>
                </div>

                <Modal content='确定要删除吗？' click={this.confirmdel.bind(this)} />
                <div className='content_wrap panel-default content_wrap'>
                    {/* <div onClick={()=>{window.location.href='./dz_cate.html'}} className='breadLine '>
                        前往分类管理
                    </div> */}
                    {/* <div className='inputs panel-body'>
                        <h3>首页管理</h3>
                    </div> */}
                    <div className="content form">
                        {/* <div style={{display:clicknew?"":"none"}} id="div"> */}

                        <div className="tabletit" >
                            {/* <p className="delall"><img src="./src/delall.png"/>批量删除</p> */}
                            {/* <p className="add" onClick={this.add.bind(this)}>新建房间</p> */}
                            <p className="add" style={{ 'cursor': 'pointer' }} onClick={() => { window.location.href = './dz_cate.html' }}>添加</p>
                            {/* <p className="add" style={{'cursor':'pointer'}} onClick={()=>{window.location.href='./export.html'}}>前往导出页</p> */}
                        </div>
                        <table className="tab">
                            <thead>
                                <tr>
                                    {/* <th className="minwidth tconter"><img src="./src/notselection.png"/></th> */}
                                    <th className="tconter">序号</th>
                                    <th className="tconter">账号</th>
                                    <th className="tconter">密码</th>
                                    <th className="cz tconter">操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                {
                                    list.map((x, i) => {
                                        return (
                                            <tr key={i}>
                                                {/* <td className="minwidth tconter"><img src="./src/notselection.png"/></td>  */}
                                                {/* <td className="tconter">{x.state=="0"?"显示":"隐藏"}</td>  */}
                                                <td className="tconter">{i + 1}</td>
                                                <td onClick={this.edit.bind(this, x)} className="tconter">{x.name}</td>
                                                <td className="operatebox">
                                                    <div className='operate' id={"ope" + x.id}>
                                                        <p className='edit' onClick={this.toitem.bind(this, x.id)}>配置</p>

                                                        {/* <div>
                                                       <img src={`./src/${x.state=="1"?"hide":"show"}.png`}/>
                                                       <p className='edit' onClick={this.setshow.bind(this,x.id,x.state)}>{x.state=="0"?"隐藏":"显示"}</p>
                                                   </div> */}
                                                        <div>
                                                            <img src="./src/del.png" />
                                                            <p className='edit colred' onClick={this.del.bind(this, x.id)}>删除</p>
                                                        </div>
                                                    </div>
                                                </td>
                                            </tr>
                                        )
                                    })
                                }

{
                                         <tr>
                                         {/* <td className="minwidth tconter"><img src="./src/notselection.png"/></td>  */}
                                         {/* <td className="tconter">{x.state=="0"?"显示":"隐藏"}</td>  */}
                                         <td style={{'width':'40px'}} className="tconter">新建行</td>
                                         <td onClick={this.clickitem.bind(this,-1,'name')} className="tconter">{additem.name}</td>
                                         <td onClick={this.clickitem.bind(this,-1,'pwd')} className="tconter">{additem.pwd}</td>
                                         <td className="operatebox">
                                             <div className='operate'>
                                                     <p className='edit'  onClick={this.save.bind(this,-1)}>保存</p>
                                                     <p className='edit'  onClick={this.save.bind(this,-1)}>删除</p>
                                             </div>
                                          </td>
                                     </tr>
                                    }


                            </tbody>
                        </table>
                    </div>

                </div >




            </div >


        )
    }
}





ReactDOM.render(
    <div>
        {/* <LeftMenu code='0' /> */}
        <FirstPage />
    </div>
    //<Barrage/>
    , $('.container')[0]
)